<template>
	<scroll-view scroll-y="true" class="detail-container">
		<view class="detail-header">
			<view class="shade"></view>
			<view class="order-status">
				<text class="ns-font-size-lg">{{ orderDetail.status_name }}</text>
			</view>
		</view>

		<block v-if="orderDetail.is_virtual == 0">
			<view class="info-wrap float" v-if="orderDetail.shipping_type == 1 || orderDetail.shipping_type == 3">
				<view class="i-head"><text>收货人信息</text></view>
				<view class="i-body">
					<view class="title ns-font-size-base">
						<view class="iconfont iconlocation"></view>
						<text>{{ orderDetail.receiver_name }} {{ orderDetail.receiver_mobile }}</text>
					</view>
					<view class="desc ns-text-color-gray ns-font-size-sm"><rich-text :nodes="orderDetail.address"></rich-text></view>
					<view class="desc ns-text-color-gray ns-font-size-sm">
						<text v-if="orderDetail.shipping_time">配送时间：{{ $util.timeStampTurnTime(orderDetail.shipping_time) }} {{ orderDetail.distribution_time_out }}</text>
						<text v-else>配送时间：工作日、双休日与节假日均可送货</text>
					</view>
				</view>
			</view>

			<view class="info-wrap float" v-if="orderDetail.shipping_type == 2">
				<view class="i-head"><text>自提点信息</text></view>
				<view class="i-body">
					<view class="title ns-font-size-base">
						<view class="iconfont iconshop"></view>
						<text>{{ orderDetail.order_pickup.name }}</text>
					</view>
					<view class="desc ns-text-color-gray ns-font-size-sm">
						<text>
							{{ orderDetail.order_pickup.province_name }} {{ orderDetail.order_pickup.city_name }} {{ orderDetail.order_pickup.district_name }}
							{{ orderDetail.order_pickup.address }}
						</text>
					</view>
				</view>
			</view>
		</block>

		<view class="info-wrap" v-if="orderDetail.buyer_message != ''">
			<view class="i-body">
				<view class="title ns-font-size-base">
					<view class="iconfont iconcomment_light"></view>
					<text>买家留言</text>
				</view>
				<view class="desc ns-text-color-gray ns-font-size-sm">
					<text>{{ orderDetail.buyer_message }}</text>
				</view>
			</view>
		</view>

		<view class="info-wrap" :class="{ float: orderDetail.is_virtual }">
			<view class="i-head"><text>商品信息</text></view>
			<view class="i-body">
				<view class="goods-list">
					<block v-for="(goodsItem, goodsKey) in orderDetail.order_goods" :key="goodsKey">
						<view class="order-goods-item padding-none" :class="orderDetail.order_goods.length == 1">
							<navigator :url="'/pages/goods/detail/detail?goods_id=' + goodsItem.goods_id" class="goods-img">
								<image :src="$util.img(goodsItem.picture_info.pic_cover_small)" mode="aspectFill"></image>
							</navigator>
							<view class="goods-info">
								<navigator :url="'/pages/goods/detail/detail?goods_id=' + goodsItem.goods_id" class="goods-name">
									<view class="gift-mark" v-if="goodsItem.gift_flag == 1">赠品</view>
									{{ goodsItem.goods_name }}
								</navigator>
								<text class="text ns-text-color">
									<text class="ns-text-color-gray">价格：</text>
									￥{{ goodsItem.price }}
								</text>
								<text class="text" v-if="goodsItem.sku_name">
									<text class="ns-text-color-gray">规格：</text>
									{{ goodsItem.sku_name }}
								</text>
								<text class="text">
									<text class="ns-text-color-gray">数量：</text>
									{{ goodsItem.num }}盒
								</text>
							</view>
						</view>
						<view class="order-goods-operating">
							<view><text class="ns-text-color-gray ns-font-size-sm" v-if="goodsItem.shipping_status">已发货</text></view>
							<view>
								<block v-if="goodsItem.gift_flag == 0 && orderDetail.is_virtual == 0">
									<!-- 退款/退货 -->
									<block v-if="orderDetail.payment_type == 4">
										<view
											class="operating-btn ns-font-size-sm"
											v-if="orderDetail.order_money > 0 && orderDetail.is_refund == 1 && goodsItem.refund_status == 0 && orderDetail.order_status == 2"
										>
											<navigator :url="'/pages/order/refund_detail/refund_detail?order_goods_id=' + goodsItem.order_goods_id">退款/退货</navigator>
										</view>
									</block>
									<block v-else>
										<block v-if="orderDetail.order_money > 0 && orderDetail.is_refund == 1 && goodsItem.refund_status == 0">
											<view class="operating-btn ns-font-size-sm">
												<navigator :url="'/pages/order/refund_detail/refund_detail?order_goods_id=' + goodsItem.order_goods_id">退款/退货</navigator>
											</view>
										</block>
										<block v-else-if="goodsItem.refund_status != 0">
											<view
												class="operating-btn ns-font-size-sm"
												v-if="
													goodsItem.refund_status != 5 &&
														goodsItem.refund_status != -1 &&
														goodsItem.refund_status != -2 &&
														orderDetail.order_status != 4 &&
														orderDetail.order_status != 5
												"
												@click="cancelRefund(orderDetail.order_id, goodsItem.order_goods_id)"
											>
												取消退款
											</view>
										</block>
									</block>
									<!-- 售后 -->
									<view v-if="orderDetail.order_money > 0 && orderDetail.order_status == 4" class="operating-btn ns-font-size-sm">
										<navigator :url="'/pages/order/aftersale/aftersale?order_goods_id=' + goodsItem.order_goods_id">
											{{ goodsItem.customer_info == null ? '申请售后' : '查看售后' }}
										</navigator>
									</view>
									<block v-if="orderDetail.order_money > 0 && goodsItem.refund_status != 0">
										<!-- 退款成功 -->
										<view class="operating-btn ns-font-size-sm">
											<navigator :url="'/pages/order/refund_detail/refund_detail?order_goods_id=' + goodsItem.order_goods_id">
												{{ goodsItem.status_name }}
											</navigator>
										</view>
									</block>
								</block>
							</view>
						</view>
					</block>
				</view>
			</view>
		</view>

		<view class="info-wrap" v-if="orderDetail.is_virtual == 1 && orderDetail.virtual_goods_list.length > 0">
			<view class="i-body">
				<view class="order-base-info">
					<block v-if="orderDetail.order_goods[0].goods_type == 0">
						<view>
							<text class="label">虚拟码：</text>
							<text>{{ orderDetail.virtual_goods_list[0].virtual_code }}</text>
							<view class="copy" @click="copy(orderDetail.virtual_goods_list[0].virtual_code)">复制</view>
						</view>
						<view>
							<text class="label">有效期：</text>
							<text>{{ orderDetail.virtual_goods_list[0].limit_time }}</text>
						</view>
					</block>
					<block v-if="orderDetail.order_goods[0].goods_type == 2">
						<view>
							<text class="label">下载链接：</text>
							<text>{{ orderDetail.virtual_goods_list[0].virtual_code }}</text>
							<view class="copy" @click="copy(orderDetail.virtual_goods_list[0].virtual_code)">复制</view>
						</view>
						<view>
							<text class="label">有效期：</text>
							<text>{{ orderDetail.virtual_goods_list[0].limit_time }}</text>
						</view>
					</block>
					<block v-if="orderDetail.order_goods[0].goods_type == 3">
						<view><text>网盘链接/提取码：</text></view>
						<view>
							<text>{{ orderDetail.virtual_goods_list[0].remark }}</text>
							<view class="copy" @click="copy(orderDetail.virtual_goods_list[0].remark)">复制</view>
						</view>
						<view>
							<text class="label">有效期：</text>
							<text>{{ orderDetail.virtual_goods_list[0].limit_time }}</text>
						</view>
					</block>
					<block v-if="orderDetail.order_goods[0].goods_type == 4">
						<view><text>卡号/密码：</text></view>
						<view>
							<text>{{ orderDetail.virtual_goods_list[0].remark }}</text>
							<view class="copy" @click="copy(orderDetail.virtual_goods_list[0].remark)">复制</view>
						</view>
						<view>
							<text class="label">有效期：</text>
							<text>{{ orderDetail.virtual_goods_list[0].limit_time }}</text>
						</view>
					</block>
				</view>
			</view>
		</view>

		<!-- 订单预售 -->
		<view class="info-wrap" v-if="orderDetail.order_type == 6">
			<view class="i-body">
				<view class="time-line">
					<view class="time-item">
						<view class="time-divider" :class="{ active: orderDetail.order_status == 6 || orderDetail.order_status == 7 }"></view>
						<text>
							阶段一：定金
							<text v-if="orderDetail.order_status == 5">（已关闭）</text>
							<text v-else-if="orderDetail.presell_info.order_status == 0">（待支付）</text>
							<text v-else-if="orderDetail.presell_info.order_status == 1">（已支付）</text>
						</text>
						<text class="f-right">￥{{ orderDetail.presell_info.presell_pay }}</text>
					</view>
					<view class="time-item">
						<view class="time-divider" :class="{ active: orderDetail.order_status != 6 && orderDetail.order_status != 7 }"></view>
						<text>
							阶段二：尾款
							<text v-if="orderDetail.order_status == 5">（已关闭）</text>
							<text v-else-if="orderDetail.pay_status == 0">（待支付）</text>
							<text v-else-if="orderDetail.pay_status > 0">（已支付）</text>
						</text>
						<text class="f-right">￥{{ orderDetail.pay_money }}</text>
					</view>
				</view>
			</view>
		</view>

		<view class="info-wrap">
			<view class="i-body">
				<view class="order-pay-info">
					<view class="clearfix">
						商品总额：
						<text class="f-right">
							<text class="ns-font-size-sm">￥</text>
							{{ orderDetail.goods_money }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.is_virtual == 0">
						运费：
						<text class="f-right">
							<text class="ns-font-size-sm">￥</text>
							{{ orderDetail.shipping_money }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.tax_money > 0">
						税费：
						<text class="f-right">
							<text class="ns-font-size-sm">￥</text>
							{{ orderDetail.tax_money }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.user_platform_money > 0">
						使用余额：
						<text class="f-right">
							<text class="ns-font-size-sm">-￥</text>
							{{ orderDetail.user_platform_money }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.point > 0">
						使用积分：
						<text class="f-right">
							<text class="ns-font-size-sm"></text>
							{{ orderDetail.point }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.promotion_money > 0">
						优惠金额：
						<text class="f-right">
							<text class="ns-font-size-sm">-￥</text>
							{{ orderDetail.promotion_money }}
						</text>
					</view>
					<view class="clearfix" v-if="orderDetail.coupon_money > 0">
						优惠券：
						<text class="f-right">
							<text class="ns-font-size-sm">-￥</text>
							{{ orderDetail.coupon_money }}
						</text>
					</view>
					<view class="clearfix">
						<text class="f-right">
							实付款：
							<text class="ns-font-size-sm ns-text-color">￥</text>
							<text class="ns-font-size-lg ns-text-color">{{ orderDetail.pay_money }}</text>
						</text>
					</view>
				</view>
			</view>
		</view>

		<view class="info-wrap">
			<view class="i-body">
				<view class="order-base-info">
					<view>
						<text class="label">订单编号：</text>
						<text>{{ orderDetail.order_no }}</text>
						<view class="copy" @click="copy(orderDetail.order_no)">复制</view>
					</view>
					<view>
						<text class="label">交易号：</text>
						<text class="ns-text-color-gray">{{ orderDetail.out_trade_no }}</text>
					</view>
					<view>
						<text class="label">订单类型：</text>
						<text class="ns-text-color-gray">{{ orderDetail.order_type_name }}</text>
					</view>
					<view v-if="orderDetail.status_name">
						<text class="label">付款状态：</text>
						<text class="ns-text-color-gray">{{ orderDetail.pay_status_name }}</text>
					</view>
					<block v-if="orderDetail.pay_status > 0">
						<view>
							<text class="label">支付方式：</text>
							<text class="ns-text-color-gray">{{ orderDetail.payment_type_name }}</text>
						</view>
						<view>
							<text class="label">付款时间：</text>
							<text class="ns-text-color-gray">{{ $util.timeStampTurnTime(orderDetail.pay_time) }}</text>
						</view>
					</block>
					<view>
						<text class="label">下单时间：</text>
						<text class="ns-text-color-gray">{{ $util.timeStampTurnTime(orderDetail.create_time) }}</text>
					</view>
					<view v-if="orderDetail.is_virtual == 0">
						<text class="label">配送方式：</text>
						<text class="ns-text-color-gray">{{ orderDetail.shipping_type_name }}</text>
					</view>
					<block v-if="orderDetail.shipping_type == 2&&orderDetail.order_pickup">
						<view v-if="orderDetail.order_pickup.picked_up_code">
							<text class="label">自提码：</text>
							<text class="ns-text-color-gray">{{ orderDetail.order_pickup.picked_up_code }}</text>
						</view>
						<view v-if="orderDetail.order_pickup.buyer_name">
							<text class="label">联系人：</text>
							<text class="ns-text-color-gray">{{ orderDetail.order_pickup.buyer_name }}</text>
						</view>
						<view v-if="orderDetail.order_pickup.buyer_mobile">
							<text class="label">联系电话：</text>
							<text class="ns-text-color-gray">{{ orderDetail.order_pickup.buyer_mobile }}</text>
						</view>
					</block>
					<block v-if="orderDetail.is_virtual == 0 &&orderDetail.buyer_invoice_info">
						<view v-if="orderDetail.buyer_invoice_info[0]">
							<text class="label">发票抬头：</text>
							<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[0] }}</text>
						</view>
						<view v-if="orderDetail.buyer_invoice_info[2]">
							<text class="label">纳税人识别号：</text>
							<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[2] }}</text>
						</view>
						<block v-if="orderDetail.buyer_invoice_info[3]">
							<view>
								<text class="label">开户银行：</text>
								<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[3] }}</text>
							</view>
							<view>
								<text class="label">银行账号：</text>
								<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[4] }}</text>
							</view>
							<view>
								<text class="label">企业地址：</text>
								<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[5] }}</text>
							</view>
							<view>
								<text class="label">企业电话：</text>
								<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[6] }}</text>
							</view>
						</block>
						<view v-if="orderDetail.buyer_invoice_info[1]">
							<text class="label">发票内容：</text>
							<text class="ns-text-color-gray">{{ orderDetail.buyer_invoice_info[1] }}</text>
						</view>
					</block>
				</view>
			</view>
		</view>

		<view class="info-wrap">
			<view class="i-body operation">
				<view class="order-operating">
					<block v-if="orderDetail.order_status == 3 || orderDetail.order_status == 4">
						<view class="operating-btn" v-if="orderDetail.is_evaluate == 0 || orderDetail.is_evaluate == 1">
							<navigator :url="'/pages/order/evaluate/evaluate?order_id=' + orderDetail.order_id + '&again=' + orderDetail.is_evaluate">
								{{ orderDetail.is_evaluate ? '我要追评' : '我要评价' }}
							</navigator>
						</view>
					</block>
					<block v-if="orderDetail.member_operation">
						<view
							class="operating-btn"
							v-for="(operationItem, operationKey) in orderDetail.member_operation"
							:key="operationKey"
							@click="orderOperation(operationItem.no, orderDetail.order_id)"
						>
							{{ operationItem.name }}
						</view>
					</block>
				</view>
			</view>
		</view>
		<loading-cover ref="loadingCover"></loading-cover>
		<ns-login ref="login" href="order_detail"></ns-login>
	</scroll-view>
</template>

<script>
import http from 'common/js/http.js';
import orderAction from '../public/js/orderAction.js';
import loadingCover from '@/components/loading/loading.vue';
import nsLogin from 'components/ns-login/ns-login.vue';

export default {
	components: {
		loadingCover,
		nsLogin
	},
	data() {
		return {
			orderId: 0,
			orderDetail: {}
		};
	},
	onBackPress(options) {
		var pages = getCurrentPages();
		var page = pages[pages.length-2];
		if(page.route != "promotionpages/pintuan/spelllist/spelllist"){
			this.$util.redirectTo('/pages/order/list/list', {});
			return true;
		}
		
	},
	onLoad(opation) {
		if (opation.order_id) this.orderId = opation.order_id;
	},
	onShow() {
		var isLogin = false;
		// #ifdef H5
		getApp().checkLogin(() => {
			isLogin = true;
			setTimeout(() => {
				this.$refs.login.clickLogin();
			}, 100);
		});
		// #endif
		// #ifdef MP
		getApp().$vm.checkLogin(() => {
			isLogin = true;
			this.$refs.login.clickLogin();
		});
		// #endif

		if (isLogin) return;

		this.getOrderDateil();
	},
	methods: {
		getOrderDateil() {
			this.sendRequest({
				url: 'System.Order.orderDetail',
				data: { order_id: this.orderId },
				success: res => {
					if (res.code == 0) {
						this.orderDetail = res.data.order;
						if (this.orderDetail.is_virtual == 1 && this.orderDetail.virtual_goods_list.length > 0) {
							if (this.orderDetail.virtual_goods_list[0].validity_period == 0) {
								this.orderDetail.virtual_goods_list[0].limit_time = '无限制';
							} else {
								this.orderDetail.virtual_goods_list[0].limit_time = this.$util.timeStampTurnTime(this.orderDetail.virtual_goods_list[0].end_time);
							}
						}
						if (this.$refs.loadingCover == undefined) return;
						this.$refs.loadingCover.hide();
					} else {
						this.$util.showToast({ title: res.message });
						setTimeout(() => {
							this.$util.redirectTo('/pages/order/list/list', {}, '', 'redirectTo');
						}, 1000);
					}
				}
			});
		},
		copy(value) {
			// #ifdef H5
			this.$util.copy(value, () => {
				this.$util.showToast({ title: '复制成功' });
			});
			// #endif

			// #ifdef MP
			uni.setClipboardData({
				data: value,
				success: () => {
					// this.$util.showToast({ title: '复制成功' });
				}
			});
			// #endif
		},
		orderOperation(operation, order_id) {
			switch (operation) {
				case 'pay': //支付
					this.pay(order_id);
					break;
				case 'close': //订单关闭
					this.orderClose(order_id, () => {
						this.getOrderDateil();
					});
					break;
				case 'getdelivery': //订单收货
					this.orderDelivery(order_id, () => {
						this.getOrderDateil();
					});
					break;
				case 'logistics': //查看物流
					this.$util.redirectTo('/pages/order/logistics/logistics', { order_id });
					break;
				case 'delete_order': //删除订单
					this.deleteOrder(order_id, () => {
						this.$util.redirectTo('/pages/order/list/list');
					});
					break;
				case 'pay_presell': //预定金支付
					this.orderPresellPay(order_id);
					break;
				case 'member_pickup': // 买家自提
					this.$util.redirectTo('/pages/order/pickup/pickup', { order_id });
					break;
				default:
					break;
			}
		},
		/**
		 * 取消退款
		 */
		cancelRefund(order_id, order_goods_id) {
			uni.showModal({
				title: '提示',
				content: '您确定要取消该次退款吗？',
				success: res => {
					if (res.confirm) {
						this.sendRequest({
							url: 'System.Order.cancelOrderRefund',
							data: { order_id, order_goods_id },
							success: res => {
								if (res.data > 0) {
									this.$util.showToast({ title: '取消成功' });
									this.getOrderDateil();
								}
							}
						});
					}
				}
			});
		}
	},
	mixins: [http, orderAction]
};
</script>

<style lang="scss">
@import '../public/css/detail.scss';
</style>
